<template>
  <a-card :bordered="false">
    <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="48">
          <a-col :md="5" :sm="15">
            <a-form-item label="名称">
              <a-input placeholder="请输入名称" v-model="queryParam.name"/>
            </a-form-item>
          </a-col>
<!--          <a-col :md="5" :sm="15">-->
<!--            <a-form-item label="模型标识">-->
<!--              <a-input placeholder="请输入模型标识" v-model="queryParam.key"/>-->
<!--            </a-form-item>-->
<!--          </a-col>-->
<!--          <a-col :md="5" :sm="15">-->
<!--            <a-form-item label="分类">-->
<!--              <a-input placeholder="请输入分类" v-model="queryParam.category"/>-->
<!--            </a-form-item>-->
<!--          </a-col>-->
          <a-col :md="8" :sm="24">
            <span class="table-page-search-submitButtons">
              <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
              <a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <div class="table-operator">
      <a-button v-if="addEnable" type="primary" icon="plus" @click="handleAddModel()">新建</a-button>
      <a-dropdown v-if="removeEnable&&selectedRowKeys.length > 0">
        <a-button type="danger" icon="delete" @click="delByIds(selectedRowKeys)">删除</a-button>
      </a-dropdown>
    </div>
    <s-table
      size="default"
      ref="table"
      rowKey="id"
      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
      :columns="columns"
      :data="loadData"
    >
      <span slot="action" slot-scope="text, record">
         <a v-if="editEnabel" @click="deploy(record)">部署流程</a>
         <a-divider type="vertical"/>
        <a v-if="editEnabel" @click="handleEdit(record)">编辑</a>
        <a-divider type="vertical"/>
        <a v-if="removeEnable" @click="delByIds([record.id])">删除</a>
      </span>
    </s-table>
    <actReModel-modal ref="modal" @ok="handleOk"/>
  </a-card>
</template>

<script>
    import {STable} from '@/components'
    import {getActReModelList, delActReModel} from '@/api/activiti/actmodel'
    import ActReModelModal from './modules/ActReModelModal.vue'
    import {checkPermission} from '@/utils/permissions'
    import {getModelId, deployActReModel} from '@/api/activiti/model'
    export default {
        name: 'TableList',
        components: {
            STable,
            ActReModelModal
        },
        data() {
            return {
                labelCol: {
                    xs: {span: 24},
                    sm: {span: 5}
                },
                wrapperCol: {
                    xs: {span: 24},
                    sm: {span: 16}
                },
                form: this.$form.createForm(this),
                mdl: {},
                // 高级搜索 展开/关闭
                advanced: false,
                // 查询参数
                queryParam: {},
                // 表头
                columns: [
                    {
                        title: '名称',
                        dataIndex: 'name'
                    },
                    {
                        title: '模型标识',
                        dataIndex: 'key'
                    },
                    {
                        title: '分类',
                        dataIndex: 'category'
                    },
                    {
                        title: '版本',
                        dataIndex: 'version'
                    },
                    {
                        title: '部署ID',
                        dataIndex: 'deploymentId'
                    },
                    {
                        title: '操作',
                        width: '200px',
                        dataIndex: 'action',
                        scopedSlots: {customRender: 'action'}
                    }
                ],
                // 加载数据方法 必须为 Promise 对象
                loadData: parameter => {
                    return getActReModelList(Object.assign(parameter, this.queryParam))
                },
                selectedRowKeys: [],
                selectedRows: [],
                addEnable: checkPermission('activiti:actReModel:add'),
                editEnabel: checkPermission('activiti:actReModel:edit'),
                removeEnable: checkPermission('activiti:actReModel:remove')
            }
        },
        filters: {},
        created() {
        },
        methods: {
            onSelectChange(selectedRowKeys, selectedRows) {
                this.selectedRowKeys = selectedRowKeys
                this.selectedRows = selectedRows
            },
            handleAdd() {
                this.$refs.modal.add()
            },
            handleAddModel() {
                getModelId().then(res => {
                    location.href = '/activiti/modeler.html?modelId=' + res
                })
            },
            handleEdit(record) {
                location.href = '/activiti/modeler.html?modelId=' + record.id
                // this.$refs.modal.edit(record)
            },
            deploy(record) {
                deployActReModel(record).then(res => {
                    if (res.code === 0) {
                        this.$message.success('部署成功')
                        this.handleOk()
                    } else {
                        this.$message.error(res.msg)
                    }
                })
            },

            handleOk() {
                this.$refs.table.refresh(true)
                console.log('handleSaveOk')
            },
            delByIds(ids) {
                delActReModel({ids: ids.join(',')}).then(res => {
                    if (res.code === 0) {
                        this.$message.success('删除成功')
                        this.handleOk()
                    } else {
                        this.$message.error(res.msg)
                    }
                    this.selectedRowKeys = []
                })
            }
        },
        watch: {
            /*
              'selectedRows': function (selectedRows) {
                this.needTotalList = this.needTotalList.map(item => {
                  return {
                    ...item,
                    total: selectedRows.reduce( (sum, val) => {
                      return sum + val[item.dataIndex]
                    }, 0)
                  }
                })
              }
              */
        }
    }
</script>
